import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
// 引入 element UI
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
// 为 Element Plus 按需引入样式。
import Icons from 'unplugin-icons/vite'
import { FileSystemIconLoader } from 'unplugin-icons/loaders'
import IconsResolver from 'unplugin-icons/resolver'
import { visualizer } from 'rollup-plugin-visualizer'
import vueJsx from '@vitejs/plugin-vue-jsx'

import UnoCSS from 'unocss/vite'

// https://vitejs.dev/config/
export default defineConfig({
  base: '/',
  resolve: {
    alias: {
      '@': resolve(__dirname, './src'),
      'api': resolve(__dirname, './src/api')
    }
  },
  plugins: [
    vue(),
    vueJsx(),
    visualizer(),
    // viteCompression(),
    AutoImport({
      resolvers: [
        ElementPlusResolver({
          importStyle: 'sass'
        })
      ]
    }),
    Components({
      resolvers: [
        ElementPlusResolver({
          importStyle: 'sass'
        }),
        IconsResolver({
          prefix: 'icon',
          alias: {
            system: 'system-uicons'
          },
          customCollections: ['cus', 'chart']
        })
      ]
    }),
    Icons({
      compiler: 'vue3',
      autoInstall: true,
      customCollections: {
        cus: FileSystemIconLoader('src/assets/svg/cus', svg => {
          return svg.replace(/<path /g, '<path fill="currentColor" ')
        }),
        chart: FileSystemIconLoader('src/assets/svg/chart', svg => {
          return svg.replace(/<path /g, '<path fill="currentColor" ')
        }),
      }
    }),
    UnoCSS()
  ],
  server: {
    // headers: {
    //   'Cross-Origin-Opener-Policy': 'same-origin',
    //   'Cross-Origin-Embedder-Policy': 'require-corp'
    // }
  //   open: true,// 是否自动启动浏览器
  //   port: 8080,//端口号
  //   proxy: { // 本地开发环境通过代理实现跨域
  //     // 正则表达式写法
  //     '/api': {
  //       target: 'https://pro.51zidan.com/crm-prod/', // 后端服务实际地址
  //       changeOrigin: true, //开启代理
  //       rewrite: (path) => path.replace(/^\/api/, '')
  //     }
  //   }
  },
  css: {
    preprocessorOptions: {
      // 全局样式引入
      scss: {
        additionalData: `
          @use "@/assets/style/main.scss" as *;
          @use "@/assets/style/resetElementTheme.scss" as *;
          `,
        javascriptEnabled: true
      }
    },
  },
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          echarts: ['echarts'] 
        }
      }
    }
  },
  esbuild: {
    drop: ['console', 'debugger']
  }
})
